<template>
    <div id="temp">
        <div class="stuInfo">
            <div class="tit">
                <span>模拟器详情</span>
                <span class="icon" @click="EditSimulator()"></span>
            </div>
            <el-row>
                <el-col :span="7">
                    <div>
                        <el-col :span="10">
                            <span class="left">资产编号：</span>
                        </el-col>
                        <el-col :span="14">
                            <span class="right">{{SimulatorData.asset_num}}</span>
                        </el-col>
                    </div>
                    <div>
                        <el-col :span="10">
                            <span class="left">开始使用时间：</span>
                        </el-col>
                        <el-col :span="14">
                            <span class="right">{{SimulatorData.use_date}}</span>
                        </el-col>
                    </div>
                </el-col>
                <el-col :span="7">
                    <div>
                        <el-col :span="10">
                            <span class="left">模拟器名称：</span>
                        </el-col>
                        <el-col :span="14">
                            <span class="right">{{SimulatorData.asset_name}}</span>
                        </el-col>
                    </div>
                    <div>
                        <el-col :span="10">
                            <span class="left">使用部门：</span>
                        </el-col>
                        <el-col :span="14">
                            <span class="right">{{SimulatorData.department}}</span>
                        </el-col>
                    </div>
                </el-col>
                <el-col :span="7">
                    <div>
                        <el-col :span="10">
                            <span class="left">规格型号：</span>
                        </el-col>
                        <el-col :span="14">
                            <span class="right">{{SimulatorData.norms}}</span>
                        </el-col>
                    </div>
                    <div>
                        <el-col :span="10">
                            <span class="left">模拟器地点：</span>
                        </el-col>
                        <el-col :span="14">
                            <span class="right">{{SimulatorData.location}}</span>
                        </el-col>
                    </div>
                </el-col>
            </el-row>
        </div>
        <div class="record">
            <el-tabs type="border-card" @tab-click="formChange">
                <el-tab-pane label="测试记录">
                    <table class="tab-table">
                        <thead>
                        <tr>
                            <th width="10%">
                                <span class="icon add" @click="OpenAddTest()"></span>
                            </th>
                            <th width="5%">序号</th>
                            <th>测试时间</th>
                            <th>测试人</th>
                            <th>测试结果</th>
                            <th>备注</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr v-for="(item,index) in list" :key="item.id">
                            <td>
                                <span class="icon edit" @click="EditTest(item.id)"></span>
                                <span class="icon del" @click="DelTest(item.id)"></span>
                            </td>
                            <td>{{index + 1}}</td>
                            <td>{{item.test_date}}</td>
                            <td>{{item.test_name}}</td>
                            <td>{{item.result}}</td>
                            <td>{{item.comment}}</td>
                        </tr>
                        </tbody>
                    </table>
                </el-tab-pane>

                <el-tab-pane label="维护保养记录" name="maintenance">
                    <el-tabs v-model="activeName" @tab-click="handleClick">
                        <el-tab-pane label="维修记录" name="maintenance">
                            <table class="tab-table">
                                <thead>
                                <tr>
                                    <th width="10%">
                                        <span class="icon add" @click="OpenMaintenance()"></span>
                                    </th>
                                    <th width="5%">序号</th>
                                    <th>资产编号</th>
                                    <th>资产名称</th>
                                    <th>故障发生时间</th>
                                    <th>故障现象</th>
                                    <th>维修状态</th>
                                    <th>故障解除时间</th>
                                    <th>金额</th>
                                    <th>负责人</th>
                                    <th>备注</th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr v-for="(item,index) in list" :key="item.id">
                                    <td>
                                        <span class="icon edit" @click="EditMaintenance(item.id)"></span>
                                        <span class="icon del" @click="DelMaintenance(item.id)"></span>
                                    </td>
                                    <td>{{index + 1}}</td>
                                    <td>{{item.asset_num}}</td>
                                    <td>{{item.asset_name}}</td>
                                    <td>{{item.start_time}}</td>
                                    <td>{{item.phenomenon}}</td>
                                    <td>{{item.condition}}</td>
                                    <td>{{item.end_time}}</td>
                                    <td>{{item.money}}</td>
                                    <td>{{item.leading_official}}</td>
                                    <td>{{item.comments}}</td>
                                </tr>
                                </tbody>
                            </table>
                        </el-tab-pane>
                        <el-tab-pane label="保养记录" name="maintain">
                            <table class="tab-table">
                                <thead>
                                <tr>
                                    <th width="10%">
                                        <span class="icon add" @click="OpenMaintain()"></span>
                                    </th>
                                    <th width="5%">序号</th>
                                    <th>资产编号</th>
                                    <th>资产名称</th>
                                    <th>保养内容</th>
                                    <th>保养日期</th>
                                    <th>金额</th>
                                    <th>负责人</th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr v-for="(item,index) in list" :key="item.id">
                                    <td>
                                        <span class="icon edit" @click="EditMaintain(item.id)"></span>
                                        <span class="icon del" @click="DelMaintain(item.id)"></span>
                                    </td>
                                    <td>{{index + 1}}</td>
                                    <td>{{item.asset_num}}</td>
                                    <td>{{item.asset_name}}</td>
                                    <td>{{item.content}}</td>
                                    <td>{{item.date}}</td>
                                    <td>{{item.money}}</td>
                                    <td>{{item.leading_official}}</td>
                                </tr>
                                </tbody>
                            </table>
                        </el-tab-pane>
                    </el-tabs>
                </el-tab-pane>
                <el-tab-pane label="空置成本" name="vacancy">
                  <table class="tab-table">
                    <thead>
                    <tr>
                      <th width="10%">
                        <span class="icon add" @click="OpenAddVacancy()"></span>
                      </th>
                      <th width="5%">序号</th>
                      <th>月份</th>
                      <th>当月工作日</th>
                      <th>空置单价</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr v-for="(item,index) in list" :key="item.id">
                      <td>
                        <span class="icon edit" @click="EditVacancy(item.id)"></span>
                        <span class="icon del" @click="DelVacancy(item.id)"></span>
                      </td>
                      <td>{{index + 1}}</td>
                      <td>{{item.month}}</td>
                      <td>{{item.workday}}</td>
                      <td>{{item.price}}</td>
                    </tr>
                    </tbody>
                  </table>
                </el-tab-pane><el-tab-pane label="测试记录">
              <table class="tab-table">
                <thead>
                <tr>
                  <th width="10%">
                    <span class="icon add" @click="OpenAddTest()"></span>
                  </th>
                  <th width="5%">序号</th>
                  <th>测试时间</th>
                  <th>测试人</th>
                  <th>测试结果</th>
                  <th>备注</th>
                </tr>
                </thead>
                <tbody>
                <tr v-for="(item,index) in list" :key="item.id">
                  <td>
                    <span class="icon edit" @click="EditTest(item.id)"></span>
                    <span class="icon del" @click="DelTest(item.id)"></span>
                  </td>
                  <td>{{index + 1}}</td>
                  <td>{{item.test_date}}</td>
                  <td>{{item.test_name}}</td>
                  <td>{{item.result}}</td>
                  <td>{{item.comment}}</td>
                </tr>
                </tbody>
              </table>
            </el-tab-pane>
                <el-tab-pane label="其他设备" name="other">
                    <table class="tab-table">
                        <thead>
                        <tr>
                            <th width="10%">
                                <span class="icon add" @click="OpenAddDevice()"></span>
                            </th>
                            <th width="5%">序号</th>
                            <th>资产编号</th>
                            <th>资产名称</th>
                            <th>规格型号</th>
                            <th>原值</th>
                            <th>数量</th>
                            <th>增加方式</th>
                            <th>累计折旧</th>
                            <th>月折旧</th>
                            <th>净值</th>
                            <th>启用时间</th>
                            <th>供应商名称</th>
                            <th>联系方式</th>
                            <th>负责人</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr v-for="(item,index) in list" :key="item.id">
                            <td>
                                <span class="icon edit" @click="EditDevice(item.id)"></span>
                                <span class="icon del" @click="DelDevice(item.id)"></span>
                            </td>
                            <td>{{index + 1}}</td>
                            <td>{{item.asset_num}}</td>
                            <td>{{item.asset_name}}</td>
                            <td>{{item.norms}}</td>
                            <td>{{item.cost}}</td>
                            <td>{{item.quantity}}</td>
                            <td>{{item.add_mode}}</td>
                            <td>{{item.accumulated_depreciation}}</td>
                            <td>{{item.monthly_depreciation}}</td>
                            <td>{{item.net_worth}}</td>
                            <td>{{item.use_date}}</td>
                            <td>{{item.supplier_name}}</td>
                            <td>{{item.contact_way}}</td>
                            <td>{{item.leading_official}}</td>
                        </tr>
                        </tbody>
                    </table>
                </el-tab-pane>
                <el-tab-pane label="上传图片" name="photo">
                    <table class="tab-table">
                        <thead>
                        <tr>
                            <th>
                                <span class="icon add" @click="OpenPhoto()"></span>
                            </th>
                            <th>缩略图</th>
                            <th>名称</th>
                            <th>上传日期</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr v-for="item in list" :key="item.id">
                            <td width="15%">
                                <span class="icon del" @click="DelPhoto(item.id)"></span>
                            </td>
                            <td width="30%"><img :src="item.path" height="50px"></td>
                            <td>{{item.name}}</td>
                            <td>{{item.date}}</td>
                        </tr>
                        </tbody>
                    </table>
                </el-tab-pane>
            </el-tabs>
        </div>
        <el-dialog title="模拟器信息" :visible.sync="pop" size="tiny">
            <el-form :model="SimulatorDatas" :label-width="width" :rules="SimulatorRules" ref="SimulatorRulesName">
                <el-form-item label="资产编号" prop="asset_num">
                    <el-col :span="span">
                        <el-input v-model="SimulatorDatas.asset_num" size="small" placeholder="请输入资产编号"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="模拟器名称" prop="asset_name">
                    <el-col :span="span">
                        <el-input v-model="SimulatorDatas.asset_name" size="small" placeholder="请输入模拟器名称"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="规格型号">
                    <el-col :span="span">
                        <el-input v-model="SimulatorDatas.norms" size="small" placeholder="请输入规格型号"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="开始使用时间">
                    <el-col :span="span">
                        <el-date-picker type="date" size="small" placeholder="选择日期" v-model="SimulatorDatas.use_date"
                                        style="width: 100%;"></el-date-picker>
                    </el-col>
                </el-form-item>
                <el-form-item label="使用部门">
                    <el-col :span="span">
                        <el-input v-model="SimulatorDatas.department" size="small" placeholder="请输入使用部门"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="模拟器地点">
                    <el-col :span="span">
                        <el-input v-model="SimulatorDatas.location" size="small" placeholder="请输入模拟器地点"></el-input>
                    </el-col>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="pop = false">取 消</el-button>
                <el-button type="primary" @click="ChangeSimulator()">确 定</el-button>
            </div>
        </el-dialog>
        <el-dialog title="添加测试记录" :visible.sync="testPop" size="tiny">
            <el-form :model="TestDatas" :label-width="width" :rules="TestRules" ref="TestRulesName">
                <el-form-item label="测试时间">
                    <el-col :span="span">
                        <el-date-picker type="date" size="small" placeholder="选择日期" v-model="TestDatas.test_date"
                                        style="width: 100%;"></el-date-picker>
                    </el-col>
                </el-form-item>
                <el-form-item label="测试人" prop="test_name">
                    <el-col :span="span">
                        <el-input v-model="TestDatas.test_name" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="测试结果">
                    <el-col :span="span">
                        <el-input v-model="TestDatas.result" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="备注">
                    <el-col :span="span">
                        <el-input v-model="TestDatas.comment" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="testPop = false">取 消</el-button>
                <el-button type="primary" @click="ChangeTest()">确 定</el-button>
            </div>
        </el-dialog>
        <el-dialog title="添加维修记录" :visible.sync="maintenancePop" size="tiny">
            <el-form :model="MaintenanceDatas" :label-width="width" :rules="MaintenanceRules"
                     ref="MaintenanceRulesName">
                <el-form-item label="资产编号" prop="asset_num">
                    <el-col :span="span">
                        <el-input v-model="MaintenanceDatas.asset_num" size="small" auto-complete="off"
                                  placeholder="选择资产名称" disabled></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="资产名称">
                    <el-col :span="span">
                        <el-select v-model="MaintenanceDatas.asset_num" placeholder="请选择">
                            <el-option v-for="item in asset" :label="item.asset_name" :value="item.asset_num"
                                       :key="item.asset_num"></el-option>
                        </el-select>
                    </el-col>
                </el-form-item>
                <el-form-item label="故障发生时间">
                    <el-col :span="span">
                        <el-date-picker type="date" size="small" placeholder="选择日期"
                                        v-model="MaintenanceDatas.start_time" style="width: 100%;"></el-date-picker>
                    </el-col>
                </el-form-item>
                <el-form-item label="故障现象">
                    <el-col :span="span">
                        <el-input v-model="MaintenanceDatas.phenomenon" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="维修状态">
                    <el-col :span="span">
                        <el-select v-model="MaintenanceDatas.condition" placeholder="请选择">
                            <el-option v-for="item in options" :key="item" :label="item" :value="item">
                            </el-option>
                        </el-select>
                    </el-col>
                </el-form-item>
                <el-form-item label="故障解除时间">
                    <el-col :span="span">
                        <el-date-picker type="date" size="small" placeholder="选择日期" v-model="MaintenanceDatas.end_time"
                                        style="width: 100%;"></el-date-picker>
                    </el-col>
                </el-form-item>
                <el-form-item label="金额">
                    <el-col :span="span">
                        <el-input v-model="MaintenanceDatas.money" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="负责人">
                    <el-col :span="span">
                        <el-input v-model="MaintenanceDatas.leading_official" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="备注">
                    <el-col :span="span">
                        <el-input v-model="MaintenanceDatas.comments" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="maintenancePop = false">取 消</el-button>
                <el-button type="primary" @click="ChangeMaintenance()">确 定</el-button>
            </div>
        </el-dialog>
        <el-dialog title="添加保养记录" :visible.sync="maintainPop" size="tiny">
            <el-form :model="MaintainDatas" :label-width="width" :rules="MaintenanceRules" ref="MaintainRulesName">
                <el-form-item label="资产编号" prop="asset_num">
                    <el-col :span="span">
                        <el-input v-model="MaintainDatas.asset_num" size="small" auto-complete="off"
                                  placeholder="请选择资产名称" disabled></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="资产名称">
                    <el-col :span="span">
                        <el-select v-model="MaintainDatas.asset_num" placeholder="请选择">
                            <el-option v-for="item in asset" :label="item.asset_name" :value="item.asset_num"
                                       :key="item.asset_num"></el-option>
                        </el-select>
                    </el-col>
                </el-form-item>
                <el-form-item label="保养内容">
                    <el-col :span="span">
                        <el-input v-model="MaintainDatas.content" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="保养日期">
                    <el-col :span="span">
                        <el-date-picker type="date" size="small" placeholder="选择日期" v-model="MaintainDatas.date"
                                        style="width: 100%;" auto-complete="off"></el-date-picker>
                    </el-col>
                </el-form-item>
                <el-form-item label="金额">
                    <el-col :span="span">
                        <el-input v-model="MaintainDatas.money" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="负责人">
                    <el-col :span="span">
                        <el-input v-model="MaintainDatas.leading_official" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="maintainPop = false">取 消</el-button>
                <el-button type="primary" @click="ChangeMaintain()">确 定</el-button>
            </div>
        </el-dialog>
        <el-dialog title="添加空置成本" :visible.sync="vacancyPop" size="tiny">
          <el-form :model="VacancyDatas" :label-width="width" :rules="VacancyRules" ref="VacancyRulesName">
            <el-form-item label="月份" prop="month">
              <el-col :span="span">
                <el-date-picker type="month" size="small" placeholder="请选择月份" v-model="VacancyDatas.month"
                                style="width: 100%;"></el-date-picker>
              </el-col>
            </el-form-item>
            <el-form-item label="当月工作日" prop="workday">
              <el-col :span="span">
                <el-input v-model="VacancyDatas.workday" size="small" placeholder="请输入当月工作日"></el-input>
              </el-col>
            </el-form-item>
            <el-form-item label="空置单价" prop="price">
              <el-col :span="span">
                <el-input v-model="VacancyDatas.price" size="small" placeholder="请输入空置单价"></el-input>
              </el-col>
            </el-form-item>

          </el-form>
          <div slot="footer" class="dialog-footer">
            <el-button @click="vacancyPop = false">取 消</el-button>
            <el-button type="primary" @click="ChangeVacancy()">确 定</el-button>
          </div>
        </el-dialog>
        <el-dialog title="添加模拟器其他设备记录" :visible.sync="otherPop" size="tiny">
            <el-form :model="DeviceDatailDatas" :label-width="width" :rules="DeviceRules" ref="DeviceRulesName">
                <el-form-item label="资产编号" prop="asset_num">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.asset_num" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="资产名称" prop="asset_name">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.asset_name" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="规格型号">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.norms" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="原值">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.cost" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="数量">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.quantity" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="增加方式">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.add_mode" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="累计折旧">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.accumulated_depreciation" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="月折旧">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.monthly_depreciation" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="净值">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.net_worth" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="启用时间">
                    <el-col :span="span">
                        <el-date-picker type="date" size="small" placeholder="选择日期" v-model="DeviceDatailDatas.use_date"
                                        style="width: 100%;"></el-date-picker>
                    </el-col>
                </el-form-item>
                <el-form-item label="供应商名称">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.supplier_name " size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="联系方式">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.contact_way" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="负责人">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.leading_official" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="teachPop = false">取 消</el-button>
                <el-button type="primary" @click="ChangeDevice()">确 定</el-button>
            </div>
        </el-dialog>
        <el-dialog title="上传图片" :visible.sync="dialogFormFile" size="tiny">
            <el-form :model="File" ref="File" label-width="80px">
                <el-form-item label="名称">
                    <el-input type="text" v-model="File.name"></el-input>
                </el-form-item>
                <el-form-item label="上传图片" prop="name">
                    <el-upload class="upload-demo" ref="upload" :action="fileAction" :on-change="fileUploadChange"
                               :file-list="fileList" :auto-upload="false" :on-success="fileUploadSuccess"
                               :on-remove="fileRemove" :data="uploadData">
                        <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
                    </el-upload>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="submitFile()" :disabled="subDisabled">提 交</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
    const SimulatorData = {
        asset_num: "",
        asset_name: "",
        norms: "",
        use_date: "",
        department: "",
        location: ""
    };
    const File = {
        name: ""
    };
    const MaintenanceData = {
        start_time: "",
        phenomenon: "",
        condition: "",
        end_time: "",
        money: "",
        asset_num: "",
        asset_name: "",
        comments: "",
        leading_official: "",
        type: "classroom"
    };
    const MaintainData = {
        asset_num: "",
        asset_name: "",
        content: "",
        date: "",
        money: "",
        leading_official: "",
        type: "classroom"
    };
    const DeviceDatailData = {
        asset_num: "",
        asset_name: "",
        norms: "",
        cost: "",
        quantity: "",
        add_mode: "",
        accumulated_depreciation: "",
        monthly_depreciation: "",
        net_worth: "",
        use_date: "",
        supplier_name: "",
        contact_way: "",
        leading_official: ""
    };
    const TestData = {
        test_date: "",
        test_name: "",
        result: "",
        comment: ""
    };
    const VacancyData = {
      month: "",
      workday: "",
      price: "",
    };
    export default {
        data() {
            return {
                SimulatorDatas: _g.cloneJson(SimulatorData),
                pop: false,
                SimulatorRules: {
                    asset_num: [{required: true, message: "请填写资产编号", trigger: "blur"}],
                    asset_name: [{required: true, message: "请填写模拟器名称", trigger: "blur"}]
                },
                SimulatorData: {},
                list: {},
                asset: {},

                MaintenanceRules: {
                    asset_num: [
                        {required: true, message: "请选择资产名称", trigger: "blur,change"}
                    ]
                },
                HireRules: {
                    lessee: [{required: true, message: "请填写租用人", trigger: "blur"}]
                },
                DeviceRules: {
                    asset_name: [{required: true, message: "请填写名称", trigger: "blur"}],
                    asset_num: [{required: true, message: "请填写编号", trigger: "blur"}]
                },

                fileList: [],
                fileAction: PATH + "Operation/simulatorPhotoAdd",
                dialogFormFile: false,
                uploadData: {
                    name: "",
                    pid: ""
                },
                File: _g.cloneJson(File),
                subDisabled: true,

                width: "200px",
                span: 15,

                activeName: "first",
                tabLabel: "测试记录",

                testPop: false,
                TestDatas: _g.cloneJson(TestData),
                TestRules: {
                    test_name: [{required: true, message: "请填写测试人", trigger: "blur"}]
                },

              vacancyPop: false,
              VacancyDatas: _g.cloneJson(VacancyData),
              VacancyRules: {
                month: [{type:'date',required: true, message: '请选择月份', trigger: 'blur,change'}],
                workday: [{required: true, message: '请输入当月工作日', trigger: 'blur'}],
                price: [{required: true, message: '请输入空置单价', trigger: 'blur'}],
              },

                options: ["代办", "完成"],
                maintenancePop: false,
                MaintenanceDatas: _g.cloneJson(MaintenanceData),

                maintainPop: false,
                MaintainDatas: _g.cloneJson(MaintainData),

                otherPop: false,
                DeviceDatailDatas: _g.cloneJson(DeviceDatailData)
            };
        },

        created() {
            this.id = this.$route.params.id;
            this.getSimulator();
            this.getList("simulatorTest");
        },

        methods: {
            /* 窗口改变 */
            formChange(item) {
                this.tabLabel = item.label;
                if (item.name == "photo") {
                    this.getList("simulatorPhoto");
                } else if (item.name == "maintenance") {
                    this.activeName = "maintenance";
                    this.getmaintenance();
                } else if (item.name == "other") {
                    this.getDeviceData();
                } else if(item.name == "vacancy"){
                  this.getList("simulatorVacancy")
                }else {
                    this.getList("simulatorTest");
                }
            },
            handleClick(tab, event) {
                this.activeName = tab.name;
                eval("this.get" + tab.name + "()");
            },

            /* 获取数据 */
            getList(action) {
                let data = {pid: this.id};
                this.apiPost("Operation/" + action, data).then(res => {
                    this.list = res;
                });
            },
            getSimulator() {
                let data = {id: this.id};
                this.apiPost("Operation/SimulatorDetail", data).then(res => {
                    this.SimulatorData = res;
                });
            },
            getPhoto() {
                let data = {pid: this.id};
                this.apiPost("Operation/simulatorPhoto", data).then(res => {
                    this.list = res;
                });
            },
            getmaintenance() {
                let data = {type: "simulator",asset_num:this.SimulatorData.asset_num};
                this.apiPost("Operation/simulatorMaintenance", data).then(res => {
                    this.list = res;
                });
            },
            getmaintain() {
                let data = {type: "simulator",asset_num:this.SimulatorData.asset_num};
                this.apiPost("Operation/simulatorMaintain", data).then(res => {
                    this.list = res;
                });
            },
            getAsset() {
                let data = {database: "operate_simulator_device"};
                this.apiPost("System/getAsset", data).then(res => {
                    this.asset = res;
                    this.asset.unshift({
                        asset_name: this.SimulatorData.asset_name,
                        asset_num: this.SimulatorData.asset_num
                    });
                });
            },
            getDeviceData() {
                let data = {id: this.id, type: this.tabName};
                this.apiPost("Operation/simulatorDevice", data).then(res => {
                    this.list = res;
                });
            },

            /* 打开编辑窗口 */
            EditSimulator() {
                let data = {id: this.id};
                this.SimulatorDatas = this.SimulatorData;
                this.apiPost("Operation/SimulatorDetail", data).then(res => {
                    this.pop = true;
                    setTimeout(() => {
                        this.$refs.SimulatorRulesName.resetFields();
                        this.SimulatorDatas = res;
                    }, 0);
                });
            },
            EditMaintenance(id) {
                let data = {id: id};
                this.apiPost("Operation/simulatorMaintenanceDetail", data).then(res => {
                    this.getAsset();
                    this.maintenancePop = true;
                    setTimeout(() => {
                        this.$refs.MaintenanceRulesName.resetFields();
                        this.MaintenanceDatas = res;
                    }, 0);
                });
            },
            EditMaintain(id) {
                let data = {id: id};
                this.apiPost("Operation/simulatorMaintainDetail", data).then(res => {
                    this.getAsset();
                    this.maintainPop = true;
                    setTimeout(() => {
                        this.$refs.MaintainRulesName.resetFields();
                        this.MaintainDatas = res;
                    }, 0);
                });
            },
            EditDevice(id) {
                let data = {id: id};
                this.apiPost("Operation/simulatorDeviceDetail", data).then(res => {
                    this.otherPop = true;
                    setTimeout(() => {
                        this.$refs.DeviceRulesName.resetFields();
                        this.DeviceDatailDatas = res;
                    }, 0);
                });
            },
            EditTest(id) {
                let data = {id: id};
                this.apiPost("Operation/simulatorTestDetail", data).then(res => {
                    this.testPop = true;
                    setTimeout(() => {
                        this.$refs.TestRulesName.resetFields();
                        this.TestDatas = res;
                    }, 0);
                });
            },
          EditVacancy(id) {
            let data = {id: id};
            this.apiPost("Operation/simulatorVacancyDetail", data).then(res => {
              this.vacancyPop = true;
              setTimeout(() => {
                this.$refs.VacancyRulesName.resetFields();
                res.month = new Date(res.month.replace('/-/','/'))
                this.VacancyDatas = res;
              }, 0);
            });
          },

            /* 提交数据 */
            ChangeSimulator() {
                this.$refs.SimulatorRulesName.validate(valid => {
                    if (valid) {
                        this.pop = false;
                        let data = this.SimulatorDatas;
                        this.apiPost("Operation/SimulatorEdit", data).then(res => {
                            let remind = res.error ? "error" : "success";
                            _g.toastMsg(remind, res.msg);
                            if (!res.error) {
                                this.getSimulator();
                            } else {
                                this.pop = true;
                            }
                        });
                    } else {
                        return false;
                    }
                });
            },
            ChangeMaintenance() {
                this.$refs.MaintenanceRulesName.validate(valid => {
                    if (valid) {
                        this.getAsset();
                        this.maintenancePop = false;
                        let data = this.MaintenanceDatas;
                        data.type = "simulator";
                        this.apiPost("Operation/simulatorMaintenanceEdit", data).then(res => {
                            let remind = res.error ? "error" : "success";
                            _g.toastMsg(remind, res.msg);
                            if (!res.error) {
                                this.getmaintenance();
                            } else {
                                this.maintenancePop = true;
                            }
                        });
                    } else {
                        return false;
                    }
                });
            },
            ChangeMaintain() {
                this.$refs.MaintainRulesName.validate(valid => {
                    if (valid) {
                        this.getAsset();
                        this.maintainPop = false;
                        let data = this.MaintainDatas;
                        data.type = "simulator";
                        this.apiPost("Operation/simulatorMaintainEdit", data).then(res => {
                            let remind = res.error ? "error" : "success";
                            _g.toastMsg(remind, res.msg);
                            if (!res.error) {
                                this.getmaintain();
                            } else {
                                this.maintainPop = true;
                            }
                        });
                    } else {
                        return false;
                    }
                });
            },
            ChangeDevice() {
                this.$refs.DeviceRulesName.validate(valid => {
                    if (valid) {
                        this.otherPop = false;
                        let data = this.DeviceDatailDatas;
                        data.cid = this.id;
                        this.apiPost("Operation/simulatorDeviceChange", data).then(res => {
                            let remind = res.error ? "error" : "success";
                            _g.toastMsg(remind, res.msg);
                            if (!res.error) {
                                this.getDeviceData();
                            } else {
                                this.otherPop = true;
                            }
                        });
                    } else {
                        return false;
                    }
                });
            },
            ChangeTest() {
                this.$refs.TestRulesName.validate(valid => {
                    if (valid) {
                        this.testPop = false;
                        let data = this.TestDatas;
                        data.sid = this.id;
                        this.apiPost("Operation/simulatorTestEdit", data).then(res => {
                            let remind = res.error ? "error" : "success";
                            _g.toastMsg(remind, res.msg);
                            if (!res.error) {
                                this.getList("simulatorTest");
                            } else {
                                this.testPop = true;
                            }
                        });
                    } else {
                        return false;
                    }
                });
            },
          ChangeVacancy() {
            this.$refs.VacancyRulesName.validate(valid => {
              if (valid) {
                this.vacancyPop = false;
                let data = this.VacancyDatas;
                data.sid = this.id;
                this.apiPost("Operation/simulatorVacancyEdit", data).then(res => {
                  let remind = res.error ? "error" : "success";
                  _g.toastMsg(remind, res.msg);
                  if (!res.error) {
                    this.getList("simulatorVacancy");
                  } else {
                    this.vacancyPop = true;
                  }
                });
              } else {
                return false;
              }
            });
          },

            /* 打开新增窗口 */
            OpenPhoto() {
                this.File = _g.cloneJson(File);
                this.fileList = [];
                this.dialogFormFile = true;
            },
            OpenMaintenance() {
                this.getAsset();
                this.MaintenanceDatas = _g.cloneJson(MaintenanceData);
                this.maintenancePop = true;
                this.$refs.MaintenanceRulesName.resetFields();
            },
            OpenMaintain() {
                this.getAsset();
                this.MaintainDatas = _g.cloneJson(MaintainData);
                this.maintainPop = true;
                this.$refs.MaintainRulesName.resetFields();
            },
            OpenAddDevice() {
                this.DeviceDatailDatas = _g.cloneJson(DeviceDatailData);
                this.otherPop = true;
                this.$refs.DeviceRulesName.resetFields();
            },
            OpenAddTest() {
                this.TestDatas = _g.cloneJson(TestData);
                this.testPop = true;
                this.$refs.TestRulesName.resetFields();
            },
          OpenAddVacancy() {
            this.VacancyDatas = _g.cloneJson(VacancyData);
            this.vacancyPop = true;
            setTimeout(()=>{
              this.$refs.VacancyRulesName.resetFields();
            },0)

          },

            /* 删除 */
            DelPhoto(id) {
                this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                })
                    .then(() => {
                        let data = {id: id};
                        this.apiPost("Operation/simulatorPhotoDelete", data).then(res => {
                            if (!res.error) {
                                this.$message({
                                    type: "success",
                                    message: res.msg
                                });
                            } else {
                                this.$message({
                                    type: "error",
                                    message: res.msg
                                });
                            }
                            this.getPhoto();
                        });
                    })
                    .catch(() => {
                        this.$message({
                            type: "info",
                            message: "已取消删除"
                        });
                    });
            },
            DelMaintenance(id) {
                this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                })
                    .then(() => {
                        let data = {id: id};
                        this.apiPost(
                            "Operation/simulatorMaintenanceDelete",
                            data
                        ).then(res => {
                            if (!res.error) {
                                this.$message({
                                    type: "success",
                                    message: res.msg
                                });
                            } else {
                                this.$message({
                                    type: "error",
                                    message: res.msg
                                });
                            }
                            this.getmaintenance();
                        });
                    })
                    .catch(() => {
                        this.$message({
                            type: "info",
                            message: "已取消删除"
                        });
                    });
            },
            DelMaintain(id) {
                this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                })
                    .then(() => {
                        let data = {id: id};
                        this.apiPost("Operation/simulatorMaintainDelete", data).then(res => {
                            if (!res.error) {
                                this.$message({
                                    type: "success",
                                    message: res.msg
                                });
                            } else {
                                this.$message({
                                    type: "error",
                                    message: res.msg
                                });
                            }
                            this.getmaintain();
                        });
                    })
                    .catch(() => {
                        this.$message({
                            type: "info",
                            message: "已取消删除"
                        });
                    });
            },
            DelDevice(id) {
                this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                })
                    .then(() => {
                        let data = {id: id};
                        this.apiPost("Operation/simulatorDeviceDelete", data).then(res => {
                            if (!res.error) {
                                this.$message({
                                    type: "success",
                                    message: res.msg
                                });
                            } else {
                                this.$message({
                                    type: "error",
                                    message: res.msg
                                });
                            }
                            this.getDeviceData();
                        });
                    })
                    .catch(() => {
                        this.$message({
                            type: "info",
                            message: "已取消删除"
                        });
                    });
            },
            DelTest(id) {
                this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                })
                    .then(() => {
                        let data = {id: id};
                        this.apiPost("Operation/simulatorTestDelete", data).then(res => {
                            if (!res.error) {
                                this.$message({
                                    type: "success",
                                    message: res.msg
                                });
                            } else {
                                this.$message({
                                    type: "error",
                                    message: res.msg
                                });
                            }
                            this.getList("simulatorTest");
                        });
                    })
                    .catch(() => {
                        this.$message({
                            type: "info",
                            message: "已取消删除"
                        });
                    });
            },
          DelVacancy(id) {
            this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning"
            })
              .then(() => {
                let data = {id: id};
                this.apiPost("Operation/simulatorVacancyDelete", data).then(res => {
                  if (!res.error) {
                    this.$message({
                      type: "success",
                      message: res.msg
                    });
                  } else {
                    this.$message({
                      type: "error",
                      message: res.msg
                    });
                  }
                  this.getList("simulatorVacancy");
                });
              })
              .catch(() => {

              });
          },

            /* 图片上传 */
            fileUploadChange(file, fileList) {
                if (fileList.length > 1) {
                    _g.toastMsg("warning", "每次限上传一个文件");
                }
                this.subDisabled = fileList.length == 1 ? false : true;
            },
            fileRemove(file, fileList) {
                this.subDisabled = fileList.length == 1 ? false : true;
            },
            fileUploadSuccess(res) {
                _g.closeGlobalLoading();
                let remind = res.error ? "error" : "success";
                _g.toastMsg(remind, res.msg);
                if (!res.error) {
                    this.dialogFormFile = false;
                    this.getPhoto();
                }
            },
            submitFile() {
                this.uploadData.name = this.File.name;
                this.uploadData.pid = this.id;
                setTimeout(() => {
                    this.$refs.upload.submit();
                }, 0);
            }
        }
    };
</script>

<style scoped>
    .headPic {
        padding: 0;
    }

    .headPic img {
        margin-left: 50px;
        width: 50%;
    }

    .add {
        width: 25px;
        height: 25px;
    }

    .stuInfo {
        margin-bottom: 20px;
    }
</style>
